<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="lib/vue.js"></script>
</head>
<body>
<div id="root">
    <!-- 单向绑定   -->
    <input type="text" :value="str">
    <hr/>
    <!--  双向绑定：数据在视图中呈现，视图中修改内容，数据也会变  -->
    <input :value="str" @input="str=$event.target.value"/>
    <hr/>
    <!-- 双向绑定建议   -->
    <input v-model:value="str" type="text"/>
    <input v-model="str" type="text"/>
    <div>{{str}}</div>
</div>
</body>
<script>
	const vm = new Vue({
		el: "#root",
        data:{
			str:"明年开春，春暖花开的时候就该找工作了"
        }
	})
</script>
</html>